<!doctype html>
<html manifest="cache.manifest">
    <head>
      
        <!-- Template for company list element -->
        <script type="text/html" id="company_li_template">
            <li class="arrow">
                <a href="#<%=companyId%>"><%=companyName%></a><small class="counter"><%=contacts.length%></small>        
            </li>
        </script>
        
        <!-- Template for a company menu -->
        <script type="text/html" id="company_menu_template">
            <div id="<%=companyId%>">
                <div class="toolbar">
                    <h1><%=companyName%></h1>
                    <a class="back" href="#">Back</a>
                </div>
                <ul class="rounded">
                </ul>
            </div>
        </script>
    
       <!-- Template for member list element -->
        <script type="text/html" id="member_li_template">
            <li class="forward">
                <a href="#<%=memberId%>"><%=fullName%></a>        
            </li>
        </script>
      
      <!-- Template for a member menu -->
        <script type="text/html" id="member_profile_template">
            <div id="<%=memberId%>">
                <div class="toolbar">
                    <h1><%=fullName%></h1>
                    <a class="back" href="#">Back</a>
                </div>
                <div class="profile_content">                 
                  <div class="memberHeader">
                      <img src="<%=picture%>" />
                      <div class="Name"><%=fullName%></div>
                      <div class="memberLocation"><%=location%></div>
                      <div class="profileUrl"><a href="<%=url%>">View LinkedIn Profile</a></div>
                  </div>
                  <div class="memberCurrent"><%=current%></div>
                  <div class="memberPast"><%=past%></div>  
                </div> 
            </div>
        </script>
          
        <meta charset="UTF-8" />
        <meta http-equiv="content-script-type" content="text/javascript">
        <meta name="apple-mobile-web-app-capable" content="yes" />
        
        <title>LinkedIn Contacts</title>
        
        <link rel="stylesheet" type="text/css" media="screen" href="lib/jqtouch.min.css" />
        <link rel="stylesheet" type="text/css" media="screen" href="skin/exomobile.css" />
      
        <script src="lib/jquery.1.4.2.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="lib/jqtouch.min.js" type="application/x-javascript" charset="utf-8"> </script>
        <script src="lib/template.js" type="application/x-javascript" charset="utf-8"> </script>  
        <script src="logic/contacts.js" type="application/x-javascript" charset="utf-8"> </script>
        <script src="logic/offline.js" type="application/x-javascript" charset="utf-8"> </script>
        <script type="text/javascript" src="http://platform.linkedin.com/in.js">
          /*
            api_key: G_UhkDu1nCc86N0X3eaRiU9edyRelSnBGnmJGiiIbokPrx0BV-6R3m7ZCYlhT9e1
            onLoad: onLinkedInLoad
            authorize: true
         */
        </script>
        
    </head>  
<body>   
      
     <!-- Config -->
     <div id="config" class="selectable">
        
              <div class="toolbar">
                    <h1 id="title">Config</h1>
               </div> 
         
                <ul class="edit rounded">
                  <li class="cfg"><span class="lbl">Offline mode: </span><span class="toggle"><input type="checkbox" name="online"/></span></li>
               </ul>              
               <div class="go"> <a href="#" class="whiteButton goback" id="taxonomyButton">Update</a> </div>                  
               <div class="about"> 
                   <p>
                        <strong>eXo demo web app</strong>
                         <br/>Version 0.1 by Mark Downey<br/>
                         <a href="http://www.exoplatform.com" target="_blank">www.exoplatform.com</a>
                   </p>                      
               </div>   
      </div> 
      
     <!-- HOME PAGE-->
      <div id="home" class="current">
      
          <div class="toolbar">
                <h1 id="title">Companies</h1>
                <a class= "config flip" id="cfgButton" href="#config">Config</a>
          </div>
      
            <ul class="rounded" id="companies">
                <!-- root categories injected here -->
            </ul>
            
            <div id="linkedin">
            <script type="IN/Login"></script>
            </div>    
        
        
            <h2>External Links</h2>
            <ul class="rounded">
            <li class="forward"><a href="http://www.exoplatform.com/" target="_blank">eXo Website</a></li>
            <li class="forward"><a href="http://www.twitter.com/exoplatform" target="_blank">eXo on Twitter</a></li>
            </ul>
                 
            <div class="info">
                <p>Add this page to your home screen to view the custom icon, startup screen, and full screen mode.</p>
            </div>
        </div>  
          
</body>
  
</html>
